{extend name="public:base"}
{block name="main"}
<div class="demoTable">
  条件搜索：
  <div class="layui-inline">
    <input class="layui-input" name="keyword" id="keyword" autocomplete="off" placeholder="请输入关键字">
  </div>
  <div class="layui-inline">
    <input class="layui-input" name="start" id="start"  placeholder="请输入开始时间">
  </div>
  <div class="layui-inline">
    <input class="layui-input" name="end" id="end"  placeholder="请输入结束时间">
  </div>

  <button class="layui-btn" data-type="reload" lay-filter="submit" lay-submit>搜索</button>
  <a class="layui-btn layui-btn-primary" href="{:url('msglist')}">重置</a>

</div>
<table class="layui-table" lay-data="{height:650,url:'{:Url('jsonmsglist')}', page:true, id:'msglist'}" lay-filter="table">
  <thead>
    <tr>
      <th lay-data="{field:'msgid', width:80, sort: true}">ID</th>
      <th lay-data="{field:'name', width:130}">姓名</th>
      <th lay-data="{field:'sex', width:130}">性别</th>
      <th lay-data="{field:'tel', width:180}">手机号</th>
      <th lay-data="{field:'msg', width:280}">内容</th>
      <th lay-data="{field:'statustype', width:280}">状态</th>
      <th lay-data="{field:'addtime', width:180, sort: true}">添加时间</th>
      <th lay-data="{fixed: 'right', width:180, align:'center', toolbar: '#barDemo'}">操作</th>
    </tr>
  </thead>
</table>
<script type="text/html" id="barDemo">
    
    {{#  if(d.status == 1){ }}
      <a class="layui-btn layui-btn-sm layui-btn-danger" lay-event="0">取消标记</a>
    {{#  } }}
  
    {{#  if(d.status == 0){ }}
      <a class="layui-btn layui-btn-sm " lay-event="1">标为已读</a>
    {{#  } }}
    
</script>

<script>
layui.use(['table','laydate','form'], function(){
  var table = layui.table;
  var laydate = layui.laydate;
  var form = layui.form;
   laydate.render({
      elem: '#start',
      max: 0
   });
    laydate.render({
      elem: '#end',
      max: 1
   });
   
  var $ = layui.$;

  //搜索
  form.on('submit(submit)', function(data){

    var keyword=$("input[name='keyword']").val();
    var start=$("input[name='start']").val();
    var end=$("input[name='end']").val();

    table.reload('msglist', {
      where: { 
        keyword:keyword,
        start:start,
        end:end
      }
    });

    return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
  });

  table.on('tool(table)', function(obj){

    var data = obj.data;

    $.post("{:url('setread')}",{"msgid":data.msgid,"status":obj.event},function(data){
      if(data.code=='1'){
        alert("修改成功~",1);
      }else{
        alert("修改失败~");
      }
    },'json');

  });
  



});

</script>
{/block}